<template>
  <div class="app-container">
    <basic-container>
      <avue-crud ref="crud" v-model="custlForm" :data="tableData" :option="tableOption" :table-loading="custlLoading" @on-load="getList" @refresh-change="refreshChange" @row-del="rowDel" @row-save="addObj" @row-update="editObj">
        <template slot-scope="scope" slot="menuLeft">
          <el-button icon="el-icon-plus" size="small" type="primary" :disabled="addButton" @click="handleAdd">新增</el-button>
        </template>
      </avue-crud>

    </basic-container>
  </div>
</template>

<script>
import { updateObj, addObj, fetchList, delObj } from '@/api/cust/previoushis'
import DIC from '@/const/cust/cust_dic'
export default {
  name: 'crud',
  data() {
    return {
      url: [],
      imgFormVisible: false,
      custlForm: {},
      custlLoading: false,
      addButton: false,
      custId: this.$route.query.custId,
      custlPage: {
        total: 0,
        currentPage: 1,
        pageSize: 10
      },
      tableOption: {
        icon: 'el-icon-info',
        label: '既往史',
        prop: 'group',
        index: true,
        border: true,
        stripe: true,
        addBtn: false,
        // editBtn: false,
        // delBtn: false,
        selection: true,
        maxHeight: 400,
        menuWidth: 280,
        // menu: true,
        indexLabel: '序号',
        align: 'center',
        column: [
          {
            label: '既往史类型',
            prop: 'jwslx',
            labelWidth: 100,
            type: 'select',
            rules: [
              {
                required: true,
                message: '请选择既往史类型'
              }
            ],
            dicData: DIC.JWSLX
          },
          {
            label: '名称/原因',
            prop: 'mingchengEnum',
            labelWidth: 100,
            type: 'select',
            display: false,
            hide: true,
            rules: [
              {
                required: true,
                message: '请选择名称/原因'
              }
            ],
            dicData: DIC.JWSJB
          },
          {
            label: '名称/原因',
            prop: 'mingcheng',
            rules: [
              {
                required: true,
                message: '请填写名称/原因'
              }
            ],
            labelWidth: 100
          },
          {
            label: '疾病名称',
            prop: 'qita',
            labelWidth: 100,
            display: false,
            rules: [
              {
                required: true,
                message: '请选择疾病名称'
              }
            ],
            hide: true
          },
          {
            label: '确诊时间',
            prop: 'qzsj',
            type: 'date',
            valueFormat: 'yyyy-MM-dd',
            format: 'yyyy-MM-dd',
            labelWidth: 100,
            rules: [
              {
                required: true,
                message: '请选择确诊时间'
              }
            ]
          }
        ]
      },
      tableData: []
    }
  },
  watch: {
    'custlForm.jwslx'() {
      if (this.custlForm.jwslx === '疾病') {
        const column1 = this.tableOption.column[1]
        column1.display = true
        const column2 = this.tableOption.column[2]
        column2.display = false
      } else {
        const column1 = this.tableOption.column[1]
        column1.display = false
        const column2 = this.tableOption.column[2]
        column2.display = true
      }
    },
    'custlForm.mingchengEnum'() {
      const column3 = this.tableOption.column[3]
      if (this.custlForm.mingchengEnum === '其他') {
        column3.display = true
      } else {
        column3.display = false
      }
    }
  },
  created() {
    if (this.validatenull(this.custId)) {
      this.addButton = true
    } else {
      this.addButton = false
    }
  },
  mounted: function() {},
  computed: {},
  methods: {
    handleAdd: function() {
      this.$refs.crud.rowAdd()
    },
    getList(page, params = {}) {
      this.custlLoading = true
      if (this.validatenull(this.custId)) {
        this.custlLoading = false
        return
      }
      params.grjbxxid = this.custId
      fetchList(
        Object.assign(params, {
          start: (page.currentPage - 1) * page.pageSize,
          length: page.pageSize
        })
      ).then(res => {
        this.custlLoading = false
        this.custlPage.total = res.data.recordsTotal
        this.tableData = res.data.data
        this.tableData.forEach(item => {
          item.mingchengEnum = item.mingcheng
        })
      })
    },
    rowDel(row) {
      this.$confirm('是否确认删除', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          delObj(row.id).then(() => {
            this.$message({
              showClose: true,
              message: '删除成功',
              type: 'success'
            })
            this.getList(this.custlPage)
          })
        })
        .catch(function(res) {
          this.$message({
            showClose: true,
            message: '删除失败' + res.message,
            type: 'error'
          })
        })
    },

    refreshChange() {
      this.getList(this.custlPage)
      this.$message({
        showClose: true,
        message: '刷新成功',
        type: 'success'
      })
    },
    editObj(row, index, done) {
      if (row.jwslx === '疾病') {
        row.mingcheng = row.mingchengEnum
      }
      updateObj(row).then(res => {
        this.$message({
          showClose: true,
          message: '更新成功',
          type: 'success'
        })
        this.getList(this.custlPage)
      })
      done()
    },
    addObj(row, done) {
      if (row.jwslx === '疾病') {
        row.mingcheng = row.mingchengEnum
      }
      row.grjbxxid = this.custId
      addObj(row).then(res => {
        this.$message({
          showClose: true,
          message: '提交成功',
          type: 'success'
        })
        this.getList(this.custlPage)
      })
      done()
    }
  }
}
</script>